﻿<UserControl x:Class="TheVerge.Phone.Controls.CommentsControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TheVerge.Phone.Controls"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    toolkit:TiltEffect.SuppressTilt="True">
    <UserControl.Resources>

        <local:CommentBrushConverter x:Key="brushConv" 
                                     CommentReplyBrush="{StaticResource PhoneForegroundBrush}" 
                                     ThreadReplyBrush="{StaticResource PhoneAccentBrush}" />
        <local:CommentOpacityConverter x:Key="opacityConv" />
        <local:CommentMarginConverter x:Key="marginConv" />

        <Style x:Key="tbDateStyle" TargetType="TextBlock" BasedOn="{StaticResource PhoneTextBlockBase}">
            <Setter Property="Foreground" Value="{StaticResource PhoneSubtleBrush}" />
            <Setter Property="TextWrapping" Value="Wrap" />
        </Style>

        <Style x:Key="tbBodyStyle" TargetType="TextBlock" BasedOn="{StaticResource PhoneTextNormalStyle}">
            <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeSmall}" />
            <Setter Property="TextWrapping" Value="Wrap" />
        </Style>

        <DataTemplate x:Key="dtComments">
            <Grid>
                <Grid DoubleTap="Comment_DoubleTap" Visibility="{Binding IsVisible, Converter={StaticResource trueVisConv}}" >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <Grid.RowDefinitions>
                        <RowDefinition />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>

                    <Rectangle 
                    Fill="{Binding NestingDepth, Converter={StaticResource brushConv}}" 
                    Margin="{Binding NestingDepth, Converter={StaticResource marginConv}, ConverterParameter=1}"
                    Opacity="{Binding NestingDepth, Converter={StaticResource opacityConv}}" 
                    Width="8" />
                    <Grid Grid.Column="1" Margin="3">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <TextBlock Text="{Binding UserName}" Foreground="{StaticResource PhoneAccentBrush}" Style="{StaticResource tbDateStyle}" />
                        <TextBlock Text="{Binding CreatedOn, Converter={StaticResource fnconv}}" Style="{StaticResource tbDateStyle}" Grid.Column="1" />
                        <TextBlock Text="{Binding Body}" Style="{StaticResource tbBodyStyle}" Grid.Row="1" Grid.ColumnSpan="2" />

                        <Button Padding="3" Margin="12,3" Grid.Row="2" Click="Reply_Click" BorderBrush="Transparent" BorderThickness="0" HorizontalAlignment="Left"
                                toolkit:TiltEffect.IsTiltEnabled="True" Background="#01000000">
                            <Path Data="F1M1568.35,1934.42L1551.46,1917.44 1551.46,1925.43C1517.67,1925.43 1515.02,1945.4 1515.02,1949.39 1522.31,1933.42 1551.46,1941.4 1551.46,1941.4L1551.46,1949.39 1568.35,1934.42z" 
                                  Stretch="Uniform" Fill="{StaticResource PhoneAccentBrush}"  Width="32" Height="32" Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5">
                                <Path.RenderTransform>
                                    <ScaleTransform ScaleX="1" ScaleY="-1" />
                                </Path.RenderTransform>
                            </Path>
                        </Button>
                    </Grid>

                    <Rectangle Height="4" Grid.ColumnSpan="2" Grid.Row="1"
                        Fill="{Binding NestingDepth, Converter={StaticResource brushConv}}" 
                        Margin="{Binding NestingDepth, Converter={StaticResource marginConv}, ConverterParameter=-1}"
                        Opacity="{Binding NestingDepth, Converter={StaticResource opacityConv}}" 
                        Visibility="{Binding IsRepliesVisible, Converter={StaticResource falseVisConv}}" />
                </Grid>
            </Grid>
        </DataTemplate>
    </UserControl.Resources>

    <Grid Background="{StaticResource PhoneBackgroundBrush}">
        <ListBox x:Name="lb"
                 Margin="{StaticResource PhoneMargin}" 
                 ItemsSource="{Binding Comments}" 
                 ItemTemplate="{StaticResource dtComments}" 
                 Visibility="{Binding HasComments, Converter={StaticResource trueVisConv}}" />

        <TextBlock Text="There are no comments." HorizontalAlignment="Center" VerticalAlignment="Center"
                   Visibility="{Binding HasComments, Converter={StaticResource falseVisConv}}" />
    </Grid>
</UserControl>